import streamlit as st
import pandas as pd
import plotly.express as px
#Plotly Express 是 Python 中一个高级数据可视化库
from datetime import datetime

# 设置页面配置
st.set_page_config(
    page_title="零花钱分析师",
    page_icon="💰",
    layout="wide"
)

# 设置页面标题
st.title("💰 零花钱分析师")
st.markdown("### 记录你的零花钱使用情况")

# 初始化会话状态
if 'transactions' not in st.session_state:
    st.session_state.transactions = []

# 侧边栏 - 添加新交易
#用于在应用中显示二级标题
with st.sidebar:
    st.header("添加新交易")
    date = st.date_input("日期", datetime.now())
    amount = st.number_input("金额", min_value=0.0, step=0.01)
    category = st.selectbox(
        "类别",
        ["零食", "文具", "玩具", "游戏", "其他"]
    )
    description = st.text_input("描述")

    if st.button("添加交易"):
        new_transaction = {
            "日期": date,
            "金额": amount,
            "类别": category,
            "描述": description
        }
        st.session_state.transactions.append(new_transaction)
        st.success("交易添加成功！")
        st.rerun()  # 刷新页面显示新数据

# 主界面
if st.session_state.transactions:
    # 转换为DataFrame并格式化
    #将数据转化为表格
    df = pd.DataFrame(st.session_state.transactions)

    # 显示交易记录
    st.subheader("交易记录")
    st.dataframe(df.style.format({"金额": "¥{:.2f}"}), height=400)

    # 可视化分析
    st.subheader("支出分析图表")

    # 使用两列布局
    #通过 st.columns(2) 可以创建两列布局
    col1, col2 = st.columns(2)

    #设计饼状图
    with col1:
        # px.pie()设计饼状图
        #按类别统计饼图
        fig_category = px.pie(
            df,
            values="金额",
            names="类别",
            title="支出类别分布",
            color_discrete_map=px.colors.sequential.RdBu
            #这个参数在绘制分类数据时非常有用，比如条形图、散点图或饼图等
            # px.colors.sequential.RdBu 是 Plotly Express 库中预定义的一种顺序 - 发散型颜色序列
        )
        # st.plotly_chart() 是 Streamlit 中用于嵌入 Plotly 交互式图表的函数
        #将图显示出来
        st.plotly_chart(fig_category, use_container_width=True)



    # 添加清空按钮
    if st.button("清空所有交易记录"):
        st.session_state.transactions = []
        st.rerun()
else:
    st.info("还没有添加任何交易记录，请在左侧添加你的第一笔交易！")

# 添加页脚
# st.markdown("---")
# st.markdown("### 使用提示")
# st.markdown("""
# 1. 在左侧添加你的每一笔支出
# 2. 查看图表了解你的支出类别分布
# 3. 通过每日趋势分析消费习惯
# """)